
.page {
  height: 100vh;
  width: 1200px; // 固定页面宽度
  margin: 0 auto; // 居中显示
  overflow-x: auto; // 允许横向滚动
  white-space: nowrap; // 禁止内容换行
  scrollbar-width: none; /* Firefox */
  -ms-overflow-style: none; /* IE 和 Edge */
  &::-webkit-scrollbar {
    display: none; /* Chrome 和 Safari */
  }
}


.card {
  display: flex; // 卡片横向排列
  width: 720px; // 固定卡片宽度
  margin-left: 32px; // 卡片之间的间距
  border: 1px solid #f0f0f0; // 添加边框
  border-radius: 8px; // 圆角

  .cover {
    width: 120px; // 封面宽度
    height: 160px; // 封面高度
    object-fit: cover; // 保持图片比例
    margin-right: 0px; // 封面与内容之间的间距
  }
  
  // .novelTitle {
  //   display: inline;
  //   cursor: 'pointer';
  //   transition: 'color 0.3s ease'; // 平滑颜色变化
  //   &:hover {
  //     color: #ed4259;
  //   }
  // }
  
  .avatar {
    cursor: 'pointer';
    transition: 'transform 0.3s ease'; // 平滑悬浮效果
    &:hover {
      transform: scale(1.2);
    }
  }
  
  .userText {
    cursor: 'pointer';
    transition: 'color 0.3s ease'; // 平滑颜色变化
    &:hover {
      color: #ed4259;
    }
  }
  
  .tag {
    cursor: 'pointer';
    transition: 'color background-color 0.3s ease'; // 平滑背景色变化
    &:hover {
      background-color: #40a9ff;
      transform: scale(1.1);
      color: antiquewhite;
    }
  }

  .description {
    white-space: normal; /* 允许文本换行 */
    word-wrap: break-word; /* 强制在单词边界换行 */
  }


}


.commentCard {
  display: flex; // 卡片横向排列
  width: 720px; // 固定卡片宽度
  margin-left: 32px; // 卡片之间的间距
  border: 1px solid #f0f0f0; // 添加边框
  border-radius: 8px; // 圆角
  padding: 0;

}

.list{
  white-space: normal; /* 允许文本换行 */
  word-wrap: break-word; /* 强制在单词边界换行 */
  word-break: break-all;
  // width: 100%;
}

.iconButton {
  cursor: 'pointer';
  transition: 'color  0.3s ease'; // 平滑背景色变化
  &:hover {
    color: black;
  }
}


.topComment {
  flex-direction: column ;
  white-space: normal;
  width: 650px;
}


